nav{background-color:#000;}

.nav-logo-name, .nav-logo-social-links
	{display:inline-block;
	 vertical-align: middle;
	 text-align:center;
	 max-height:10vh;
	 color:#fff;
	}
.nav-logo-name-kanji
	{font-size:20px;}
.nav-logo-name-romaji
	{padding-left:1em;
	 font-size:16px;}
.nav-logo
	{direction:ltr;
	 display:grid;
	 grid-template-columns:4fr 1fr;
	 place-items:center;
	 padding:0;
	 }
.lang span, .lang img{display:inline-block;vertical-align:middle;}

.nav-logo p   {font-size:18px;margin:auto;}
.nav-logo img {max-width:24px;}
.lang span	  {font-size:10px;margin-right:0.5em;}

nav{width:100%;
	position:fixed;
	top:0;
	height:10vh;
	z-index:2;
	}


@media (min-width: 0px) {

.nav-in
	{display:grid;
	 margin:0 auto;
	}
	 
.nav-menu
	{display:flex;
     justify-content:space-around;
	 align-items:center;
     padding-left:15px;
	 padding-right:15px;
	 direction:ltr;
	}
.nav-menu, .nav-logo{height:5vh;}
}
.nav-tabs
	{display: inline-block;
	 vertical-align: middle;}

.nav-tabs-text{font-size:16px;}

@media (min-width: 576px) {
.nav-in
	{
	 grid-template-columns:1fr;
	}
.nav-tabs-text{font-size:28px;}
.nav-logo p   {font-size:28px;margin:auto;}
.nav-logo img {max-width:36px;}
.lang span	  {font-size:20px;margin-right:0.5em;}
}
@media (min-width: 768px) {}
@media (min-width: 992px) {
.nav-menu
	{justify-content:space-between;}
nav{display:grid;
	align-items:center}
.nav-in
	{direction:rtl;
	 grid-template-columns:1fr 1fr;
	 width:80%;
	 height:10vh;
	 align-items:center;
	}
.nav-menu, .nav-logo{height:5vh;}
.nav-tabs-text{font-size:32px;}

.nav-logo p   {letter-spacing:0.1em;}
.nav-logo img {max-width:48px;}

}

@media (min-width: 1200px) {

}
@media (min-width: 1400px) {}